<%
layout("/include/_container.html", {title:"通知公告", parent:"我的面板"}){
%>

<script>
        $(document).ready(function () {
            $('#table').bootstrapTable({

                //请求方法
                method: 'post',
                //类型json
                dataType: "json",
                contentType: "application/x-www-form-urlencoded",
                //移动端自适应
                mobileResponsive: true,
                //显示检索按钮
                showSearch: true,
                //允许列拖动大小
                resizable: true,
                //固定表头
                stickyHeader: true,
                stickyHeaderOffsetY: 0,
                //显示刷新按钮
                showRefresh: true,
                //显示切换手机试图按钮
                showToggle: true,
                //显示 内容列下拉框
                showColumns: true,
                //显示到处按钮
                showExport: true,
                //显示切换分页按钮
                showPaginationSwitch: true,
                //最低显示2行
                minimumCountColumns: 2,
                //是否显示行间隔色
                striped: false,
                //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                cache: false,
                //是否显示分页（*）
                pagination: true,
                //排序方式 
                sortOrder: "asc",
                //初始化加载第一页，默认第一页
                pageNumber: 1,
                //每页的记录行数（*）
                pageSize: 10,
                //可供选择的每页的行数（*）
                pageList: [10, 25, 50, 100],
                rightFixedColumns: true, //右侧冻结列
                rightFixedNumber: 1,
                //这个接口需要处理bootstrap table传递的固定参数,并返回特定格式的json数据
                url: "${ctx}/tools/testInterface/data",
                //默认值为 'limit',传给服务端的参数为：limit, offset, search, sort, order Else
                //queryParamsType:'',
                ////查询参数,每次调用是会带上这个参数，可自定义
                queryParams: function (params) {
                    var searchParam = $("#searchForm").serializeJSON();
                    searchParam.pageNo = params.limit === undefined ? "1" : params.offset / params.limit + 1;
                    searchParam.pageSize = params.limit === undefined ? -1 : params.limit;
                    if (params.sort && params.order) {
                        searchParam.orderBy = params.sort + " " + params.order;
                    }
                    return searchParam;
                },
                //分页方式：client客户端分页，server服务端分页（*）
                sidePagination: "server",
                onShowSearch: function () {
                    $("#search-collapse").slideToggle();
                },
                columns: [{
                    checkbox: true

                }
                    , {
                        field: 'name',
                        title: '接口名称',
                        width: "20%",
                        sortable: true

                    }
                    , {
                        field: 'type',
                        title: '接口类型',
                        width: "10%",
                        sortable: true

                    }
                    , {
                        field: 'url',
                        width: "20%",
                        title: '请求URL',
                        class: 'break-word',
                        sortable: true

                    }
                    , {
                        field: 'body',
                        title: '请求body',
                        width: "10%",
                        class: 'break-word',
                        sortable: true

                    }
                    , {
                        field: 'successmsg',
                        title: '成功时返回消息',
                        class: 'break-word',
                        class: 'break-word',
                        width: "10%",
                        sortable: true

                    }
                    , {
                        field: 'errormsg',
                        title: '失败时返回消息',
                        width: "10%",
                        sortable: true

                    }
                    , {
                        field: 'remarks',
                        title: '备注信息',
                        width: "10%",
                        sortable: true

                    }, {
                        field: 'operate',
                        title: '操作',
                        width: "10%",
                        align: 'center',
                        class: 'text-nowrap',
                        events: {
                            'click .edit': function (e, value, row, index) {
                                jp.go("${ctx}/tools/testInterface/form?id=" + row.id);
                            },
                            'click .del': function (e, value, row, index) {
                                jp.confirm('确认要删除该测试接口记录吗？', function () {
                                    jp.loading();
                                    jp.get('${ctx}/tools/testInterface/delete?id=' + row.id, function (data) {
                                        if (data.success) {
                                            $('#table').bootstrapTable('refresh');
                                            jp.success(data.msg);
                                        } else {
                                            jp.error(data.msg);
                                        }
                                    })

                                })
                            },
                            'click .test': function (e, value, row, index) {
                                test(row.id);
                            }
                        },
                        formatter: function operateFormatter(value, row, index) {
                            return [
                                '<a href="javascript: return false" class="test btn btn-xs btn-custom waves-effect waves-light m-r-5">测试</a>',
                                 <% if(shiro.hasPermission("tools:testInterface:edit")){ %>
                                    '<a href="javascript: return false" class="edit btn btn-xs btn-success waves-effect  waves-light m-r-5">编辑</a>',
                                <% } %>
                                <% if(shiro.hasPermission("tools:testInterface:del")){ %>
                                '<a href="javascript: return false" class="del btn btn-danger waves-effect btn-xs waves-light" >删除 </a>'
                                <% } %>
                            ].join('');
                        }
                    }

                ]

            });



            $('#table').on('check.bs.table uncheck.bs.table load-success.bs.table ' +
                'check-all.bs.table uncheck-all.bs.table', function () {
                $('#remove').prop('disabled', !$('#table').bootstrapTable('getSelections').length);
                $('#edit').prop('disabled', $('#table').bootstrapTable('getSelections').length != 1);
            });


            $("#search").click("click", function () {// 绑定查询按扭
                $('#table').bootstrapTable('refresh');
            });

            $("#reset").click("click", function () {// 绑定查询按扭
                $("#searchForm  input").val("");
                $("#searchForm  select").val("");
                $('#table').bootstrapTable('refresh');
            });
        });

        function getIdSelections() {
            return $.map($("#table").bootstrapTable('getSelections'), function (row) {
                return row.id
            });
        }

        function deleteAll() {

            jp.confirm('确认要删除该测试接口记录吗？', function () {
                jp.loading();
                jp.get("${ctx}/tools/testInterface/deleteAll?ids=" + getIdSelections(), function (data) {
                    if (data.success) {
                        $('#table').bootstrapTable('refresh');
                        jp.success(data.msg);
                    } else {
                        jp.error(data.msg);
                    }
                })

            })
        }

        function add() {
            jp.go("${ctx}/tools/testInterface/form");
        }
        function edit() {
          jp.go("${ctx}/tools/testInterface/form?id=" + getIdSelections());
        }

        function test(id) {
            if (!id) {
                id = getIdSelections();
            }
            jp.openTab("${ctx}/tools/testInterface/test?id=" + id, "接口测试", false);
        }
    </script>
<style type="text/css">
    .AutoNewline {
        Word-break: break-all; /*必须*/
    }
</style>
<!-- 搜索 -->
<div id="search-collapse" class="collapse white-box" style="position:relative;margin-bottom: 5px">
    <a class="jp-ti-close close"
       onclick="$('#search-collapse').fadeToggle()">
        <i class="fa fa-times"></i>
    </a>
    <form id="searchForm" class="form-inline">
        <div class="form-group m-b-10 m-r-10">
            <label class="m-r-10" title="接口名称">接口名称：</label>
            <input name="name"  maxlength="200" class="form-control"/>
        </div>
        <div class="form-group m-b-10 m-r-10">
            <label class="m-r-10" title="接口类型">接口类型：</label>
            <#select path="type" items="${fn.getDictList('interface_type')}" class="w-xs" itemLabel="label" itemValue="value" />
        </div>
        <div class="form-group m-b-10 m-r-10">
            <a  id="search" class="btn btn-custom waves-effect waves-light m-l-10 btn-md btn-rounded"><i class="fa fa-search"></i> 查询</a>
            <a  id="reset" class="btn btn-custom waves-effect waves-light m-l-10 btn-md btn-rounded" ><i class="fa fa-refresh"></i> 重置</a>
        </div>
    </form>
</div>


<div class="white-box">
        <!-- 工具栏 -->
        <div id="toolbar">
                <% if(shiro.hasPermission("tools:testInterface:add")){ %>
                <button id="add" class="btn btn-custom waves-effect w-xs waves-light" onclick="add()">
                <i class="fa fa-plus"></i> 新建</button>
                <% } %>
                <% if(shiro.hasPermission("tools:testInterface:edit")){ %>
                <button id="edit" class="btn btn-white waves-effect w-xs waves-light" disabled onclick="edit()">
                <i class="fa fa-edit"></i> 修改
                 </button>
            <% } %>
                <% if(shiro.hasPermission("tools:testInterface:del")){ %>
            <button id="remove" class="btn btn-white waves-effect w-xs waves-light" disabled onclick="deleteAll()">
                <i class="fa fa-remove"></i> 删除
            </button>
            <% } %>
            <button class="btn btn-white waves-effect w-xs waves-light" onclick="test()"><i class="fa fa-check"></i> 测试</button>
        </div>
        <!-- 表格 -->
        <table id="table" class="table-bordered" data-toolbar="#toolbar"></table>
</div>
<% } %>